<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
<jsp:include page="common_header.jsp"></jsp:include>
<title>添加管理员 - 管理员管理 - H-ui.admin v3.1</title>
</head>
<body>
<article class="page-container">
	<form class="form form-horizontal" id="form-admin-add">
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户名：</label>
		<div class="formControls col-xs-8 col-sm-9">
			<input type="text" class="input-text" value="" placeholder="" id="username" name="username">
		</div>
	</div>
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"></span>姓名：</label>
		<div class="formControls col-xs-8 col-sm-9">
			<input type="text" class="input-text" value="" placeholder="" name="fullName">
		</div>
	</div>
<!-- 	<div class="row cl"> -->
<!-- 		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>初始密码：</label> -->
<!-- 		<div class="formControls col-xs-8 col-sm-9"> -->
<!-- 			<input type="password" class="input-text" autocomplete="off" value="" placeholder="请输入密码" id="password" name="password"> -->
<!-- 		</div> -->
<!-- 	</div> -->
<!-- 	<div class="row cl"> -->
<!-- 		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>确认密码：</label> -->
<!-- 		<div class="formControls col-xs-8 col-sm-9"> -->
<!-- 			<input type="password" class="input-text" autocomplete="off"  placeholder="请再输入一次密码" id="password2" name="password2"> -->
<!-- 		</div> -->
<!-- 	</div> -->
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"></span>性别：</label>
		<div class="formControls col-xs-8 col-sm-9 skin-minimal">
			<div class="radio-box">
				<input name="gender" type="radio" value="1" id="sex-1" checked>
				<label for="sex-1">男</label>
			</div>
			<div class="radio-box">
				<input type="radio" id="sex-2" value="0" name="gender">
				<label for="sex-2">女</label>
			</div>
		</div>
	</div>
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机：</label>
		<div class="formControls col-xs-8 col-sm-9">
			<input type="text" class="input-text" value="" placeholder="" id="phone" name="phone">
		</div>
	</div>
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>邮箱：</label>
		<div class="formControls col-xs-8 col-sm-9">
			<input type="text" class="input-text" placeholder="@" name="email" id="email">
		</div>
	</div>
	<div class="row cl">
		<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>角色：</label>
		<div class="formControls col-xs-8 col-sm-9 skin-minimal" id="rolesDiv">
		</div>
	</div>
	<div class="row cl">
		<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
			<input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
		</div>
	</div>
	</form>
</article>

<jsp:include page="_footer.jsp"></jsp:include>
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript">
var userId;
$(function(){
	$('.skin-minimal input').iCheck({
		checkboxClass: 'icheckbox-blue',
		radioClass: 'iradio-blue',
		increaseArea: '20%'
	});
	
	$("#form-admin-add").validate({
		rules:{
			username:{
				required:true,
				minlength:3,
				maxlength:30
			},
			fullName:{
				required:false,
				minlength:1,
				maxlength:50
			},
// 			password:{
// 				required:true,
// 				minlength:3,
// 				maxlength:30
// 			},
// 			password2:{
// 				required:true,
// 				equalTo: "#password",
// 				minlength:3,
// 				maxlength:30
// 			},
			phone:{
				required:true,
				isPhone:true
			},
			email:{
				required:true,
				email:true,
				maxlength:50
			},
			roleIds:{
				required:true
			}
		},
		success:"valid",
		submitHandler:function(form){
			addOrUpdateUser();
		}
	});
});

function addOrUpdateUser(){
	var url = "${path}/user/add.do";
	var type = '添加';
	var formData = $('#form-admin-add').serialize();
	if (userId) {
		url = "${path}/user/update.do";
		type = '修改';
		formData += '&id='+userId;
	}
	$.ajax({
		url: url,
		data: formData, 
		type: "POST",
		success: function(data, textStatus){
			if (data.code == 0) {
				layer.msg(type+'成功!',{icon:1,time:1000});
				setTimeout(function(){
					var index = parent.layer.getFrameIndex(window.name);
					parent.refresh(index);
				}, 1500);
			}else{
				alert(type+"失败！");
			}
		},
		error: function (data, textStatus, errorThrown) {
			alert("系统错误！");
		}
	});	
	
}

function fillData(id){
	userId = id;
	$.ajax({
		url: "${path}/user/detail.do",
		data: 'id='+id, 
		type: "POST",
		success: function(data, textStatus){
			if (data.code == 0) {
				var obj = data.data;
				
				var roleData = data.params.roleData;
				for (let i = 0; i < roleData.length; i++) {
					let checkStr = roleData[i].check ? 'checked=checked' : '';
					$('#rolesDiv').append(strTempl('<div class="check-box"><input type="checkbox" name="roleIds" value="{2}" id="rolecheckbox-{0}" {3}><label for="rolecheckbox-{0}">{1}</label></div>'
							, i, roleData[i].name, roleData[i].id, checkStr));
				}
				$('.skin-minimal input').iCheck({
					checkboxClass: 'icheckbox-blue',
					radioClass: 'iradio-blue',
					increaseArea: '20%'
				});
				
				fillFormByName('form-admin-add', obj);
				$('#password2').val(obj.password);
			}else{
				alert(data.msg);
			}
		},
		error: function (data, textStatus, errorThrown) {
			var s=JSON.stringify(data);
			//console.log(s);
		}
	});
}

function initRoleData(){
	$.ajax({
		url: "${path}/sysRole/queryAll.do",
		type: "POST",
		success: function(data, textStatus){
			if (data.code == 0) {
				var roleData = data.data;
				
				for (let i = 0; i < roleData.length; i++) {
					let checkStr = roleData[i].check ? 'checked=checked' : '';
					$('#rolesDiv').append(strTempl('<div class="check-box"><input type="checkbox" name="roleIds" value="{2}" id="rolecheckbox-{0}" {3}><label for="rolecheckbox-{0}">{1}</label></div>'
							, i, roleData[i].name, roleData[i].id, checkStr));
				}
				$('.skin-minimal input').iCheck({
					checkboxClass: 'icheckbox-blue',
					radioClass: 'iradio-blue',
					increaseArea: '20%'
				});
			}else{
				alert(data.msg);
			}
		},
		error: function (data, textStatus, errorThrown) {
			var s=JSON.stringify(data);
			//console.log(s);
		}
	});
}
</script> 
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
